<style>
    .layui-layer-title {
        display: flex;
        align-items: center;
    }

    #ProductionOrder-form .layui-disabled {
        color: #393d49 !important;
    }
</style>

<!-- 正文开始 -->
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <!-- 头部操作栏 -->
            <div class="layui-form lay-header">
                <div class="toolbar">
                    <div class="layui-form-item lay-query-content">
                        <div class="lay-query-box">
                            <div class="query-lt">
                                <div class="layui-inline">
                                    <label class="layui-form-label">订单编号</label>
                                    <div class="layui-input-inline mr0">
                                        <input name="productionOrderNumber" class="layui-input" type="text"
                                               placeholder="请输入订单编号"/>
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label">客户名称</label>
                                    <div class="layui-input-inline mr0">
                                        <input name="customerName" class="layui-input" type="text"
                                               placeholder="请输入客户名称"/>
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <label class="layui-form-label">捆包号</label>
                                    <div class="layui-input-inline mr0">
                                        <input name="userBundleCode" class="layui-input" type="text"
                                               placeholder="请输入捆包号"/>
                                    </div>
                                </div>
                                <div class="layui-inline">
                                    <button class="layui-btn icon-btn color-green" lay-filter="formSubSearchLog"
                                            lay-submit>查询
                                    </button>
                                    <button class="layui-btn icon-btn color-white" lay-filter="resets" lay-submit>重置
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="lay-btn-rows">
                    <div class="lay-btn-box">
                        <div class="lay-btn-lt">
                            <button id="ProductionOrderBtnAdd" class="layui-btn icon-btn color-reseda">添加</button>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 表格 -->
            <table class="layui-table" id="ProductionOrderTable" lay-filter="ProductionOrderTable"></table>
        </div>
    </div>
</div>

<!-- 表格操作列 -->
<script type="text/html" id="ProductionOrderTableBar">
    <div class="layui-btn-group" style="display: flex; align-items: center;width: 100%;justify-content: space-around;">
        <button class="layui-btn layui-btn-xs layui-btn" lay-event="detail">详情</button>
        {{# if(d.status == 1) { }}
        <button class="layui-btn layui-btn-warm layui-btn-xs" lay-event="detail">受理</button>
        {{# } }}
        {{# if(d.status != 8) { }}
        <button class="layui-btn layui-btn-danger layui-btn-xs" lay-event="detail">终止</button>
        {{# } }}
    </div>
</script>

<!-- js部分 -->
<script>
    layui.use(["layer", "form", "util", "table", "admin", "laytpl", "laydate", "tableTreeDj"], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var form = layui.form;
        var table = layui.table;
        var admin = layui.admin;

        // 渲染表格
        var insTb = table.render({
            elem: "#ProductionOrderTable",
            url: layui.config.base + "warehouse/warehouse/productionOrder/list",
            toolbar: true,
            defaultToolbar: ["filter"],
            where: {access_token: layui.config.getToken().access_token},
            page: true,
            cellMinWidth: 100,
            cols: [
                [
                    {type: "numbers"},
                    {field: "productionOrderNumber", align: "center", title: "生产加工订单编号"},
                    {
                        field: "source",
                        align: "center",
                        title: "来源",
                        templet: function (d) {
                            return d.source === 1 ? "客户录入" : "后台录入";
                        }
                    },
                    {field: "customerName", align: "center", title: "客户名称"},
                    {field: "customerCode", align: "center", title: "客户编码"},
                    // {field: "userBundleCode", align: "center", title: "捆包号"},
                    {field: "contractCode", align: "center", title: "合同编号"},
                    {field: "materialType", align: "center", title: "物料总类"},
                    {field: "remainingProductionSchedule", align: "center", title: "剩余排产数量"},
                    {field: "processingReportNumber", align: "center", title: "报工数量"},
                    {field: "qualityTestingQualifiedNumber", align: "center", title: "质检合格数"},
                    {field: "qualityTestingUnqualifiedNumber", align: "center", title: "质检不合格数"},
                    {field: "finishedProductNumber", align: "center", title: "成品入库数"},
                    {field: "totalWeight", align: "center", title: "总重量"},
                    {field: "totalProcessingFee", align: "center", title: "总加工费"},
                    {
                        field: "status",
                        align: "center",
                        title: "状态",
                        templet: function (d) {
                            switch (d.status) {
                                case "1":
                                    return "待受理";
                                case "2":
                                    return "已受理";
                                case "3":
                                    return "已排产";
                                case "4":
                                    return "加工中";
                                case "5":
                                    return "运输中";
                                case "6":
                                    return "完成";
                                default:
                                    return "已撤回";
                            }
                        }
                    },
                    {field: "creatorName", align: "center", title: "作业人"},
                    {
                        field: "createTime", align: "center", title: "创建时间", templet: function (d) {
                            return d.createTime?d.createTime:'未记录时间';
                        }
                    },
                    {align: "center", toolbar: "#ProductionOrderTableBar", fixed: "right", title: "操作", width: 200}
                ]
            ]
        });

        // 工具条点击事件
        table.on("tool(ProductionOrderTable)", function (obj) {
            var data = obj.data;
            var layEvent = obj.event;

            if (layEvent === "detail") {
                admin.req(
                    "warehouse/warehouse/productionOrder/selectProductionDetail",
                    {id: data.id},
                    (res) => {
                        if (res.code === 200) {
                            openFormFun("detail", res.data);
                        }
                    }
                );
            }
        });

        // 搜索
        form.on("submit(formSubSearchLog)", function (data) {
            insTb.reload({where: data.field, page: {curr: 1}}, "data");
        });

        // 重置搜索
        form.on("submit(resets)", function (data) {
            insTb.reload({where: admin.resetSearch(data.field), page: {curr: 1}}, "data");
        });

        // 添加按钮点击事件
        $("#ProductionOrderBtnAdd").click(function () {
            openFormFun("add");
        });

        function openFormFun(eventName, data) {
            admin.formOpen({
                area: "90%",
                offset: "10%",
                title: "配置订单物料信息",
                path: "components/warehouse/product/warehouseProductionOrderForm.html",
                success: function () {
                    parentData.eventName = eventName;
                    parentData.data = data;
                }
            });
        }
    });
</script>
